<!-- 通用形配置 -->
<template>
	<div>
		<template v-if="main.activeOption.is == 'dv-capsule-chart'">
			<el-form-item label="单位名称">
				<avue-input :disabled="disabled" v-model="main.activeOption.unit"> </avue-input>
			</el-form-item>
			<el-form-item label="显示数值">
				<avue-switch v-model="main.activeOption.showValue" :disabled="disabled"> </avue-switch>
			</el-form-item>
			<el-form-item label="名称长度">
				<avue-input-number v-model="main.activeOption.nameLength" :min="0" :disabled="disabled"></avue-input-number>
			</el-form-item>
			<el-form-item label="内右边距">
				<avue-input-number v-model="main.activeOption.paddingRight" :min="0" :disabled="disabled"></avue-input-number>
			</el-form-item>
		</template>
		<template v-if="main.activeOption.is == 'dv-water-level-pond'">
			<el-form-item label="水位图形状">
				<avue-select :disabled="disabled" v-model="main.activeOption.shape" :dic="dicOption.waterLevelType"> </avue-select>
			</el-form-item>
			<el-form-item label="水位图配色">
				<avue-input-color :disabled="disabled" v-model="main.activeOption.color"></avue-input-color>
			</el-form-item>
			<el-form-item label="波浪数量">
				<avue-input-number v-model="main.activeOption.waveNum" :min="0" :disabled="disabled"></avue-input-number>
			</el-form-item>
			<el-form-item label="波浪高度">
				<avue-input-number v-model="main.activeOption.waveHeight" :min="0" :disabled="disabled"></avue-input-number>
			</el-form-item>
			<el-form-item label="波浪透明度">
				<avue-input-number v-model="main.activeOption.waveOpacity" :min="0" :max="1" :step="0.1" :disabled="disabled"></avue-input-number>
			</el-form-item>
			<el-form-item label="信息格式化">
				<avue-input :disabled="disabled" placeholder="{value}%" v-model="main.activeOption.formatter"> </avue-input>
			</el-form-item>
		</template>
		<template v-if="main.activeOption.is == 'dv-percent-pond'">
			<el-form-item label="开始配色">
				<avue-input-color :disabled="disabled" v-model="main.activeOption.startColors"></avue-input-color>
			</el-form-item>
			<el-form-item label="结束配色">
				<avue-input-color :disabled="disabled" v-model="main.activeOption.endColors"></avue-input-color>
			</el-form-item>
			<el-form-item label="文字颜色">
				<avue-input-color :disabled="disabled" v-model="main.activeOption.textColor"></avue-input-color>
			</el-form-item>
			<el-form-item label="边框宽度">
				<avue-input-number v-model="main.activeOption.borderWidth" :min="0" :disabled="disabled"></avue-input-number>
			</el-form-item>
			<el-form-item label="边框半径">
				<avue-input-number v-model="main.activeOption.borderRadius" :min="0" :disabled="disabled"></avue-input-number>
			</el-form-item>
			<el-form-item label="边框间隙">
				<avue-input-number v-model="main.activeOption.borderGap" :min="0" :disabled="disabled"></avue-input-number>
			</el-form-item>
			<el-form-item label="线条间隙">
				<avue-input-number v-model="main.activeOption.lineDash" :min="0" :disabled="disabled"></avue-input-number>
			</el-form-item>
			<el-form-item label="局部渐变"> <avue-switch v-model="main.activeOption.localGradient" :disabled="disabled"></avue-switch></el-form-item>
			<el-form-item label="信息格式化">
				<avue-input :disabled="disabled" placeholder="{value}%" v-model="main.activeOption.formatter"> </avue-input>
			</el-form-item>
		</template>
	</div>
</template>

<script>
// import codeedit from '../../page/group/code';
import { dicOption } from '@/option/config';
export default {
	name: 'datav',
	inject: ['main', 'contain'],
	data() {
		return {
			dicOption: dicOption,
			code: {
				box: false,
				obj: {}
			}
		};
	},
	components: {
		// codeedit
	},
	methods: {
		codeClose(value) {
			this.main.activeObj[this.code.type] = value;
		},
		openCode() {
			this.code.type = 'echartFormatter';
			this.code.obj = this.main.activeObj[this.code.type];
			this.code.box = true;
		}
	}
};
</script>

<style></style>
